<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" th:href="@{/static/layui/css/layui.css}" media="all">
    <link rel="stylesheet" th:href="@{/static/admin/style.css}" media="all">
    <script type="text/html" id="indexTpl">
        {{d.LAY_TABLE_INDEX+1}}
    </script>
</head>
<style>
    .layui-table[lay-even] tr:nth-child(even) {
        /* background-color: #aaffaa; */
        background-color: #eeffee;
    }
    /* 鼠标指向表格时,奇数行背景颜色 */
    .layui-table tbody tr:hover,.layui-table-hover {
        background-color: #eeffee;
    }
    /* 表格头部工具栏背景色 */
    .layui-table-tool {
        background-color: #eeffee;
    }
    /* 表格头部背景色 */
    th {
        background-color: #359f6a;
        /* MediumSeaGreen */
        color: #fff;
        font-weight: bold
    }
</style>
<body class="layui-layout-body">

<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-card">
                <div class="layui-card-header">药品保质期检查</div>
                <div class="layui-card-body">

                    <table class="layui-hide" id="main-table" lay-filter="main-table"></table>

                    <script type="text/html" id="toolbarDemo">
                        <span class="layui-inline" lay-event="add"><i class="layui-icon">&#xe654;</i></span>

                        <span class="layui-inline" style="width: 240px;">
                            <input class="layui-input" name="param" id="param" placeholder="根据药品名称查询" autocomplete="off">
                        </span>

                        <span class="layui-btn layui-btn-sm layui-bg-red" lay-event="querySearch">
                            <i class="layui-icon">&#xe615;</i>查询
                        </span>

                    </script>

                </div>
            </div>
        </div>
    </div>
</div>

<script th:src="@{/static/layui/layui.js}"></script>

<script>
    layui.use(['table','form'],function () {

        var $ = layui.$;
        var table = layui.table;
        table.render({
            elem:'#main-table',
            height: 650,
            url: '/druginfo/druginfoQueryPage',
            method: 'POST',
            page: true,
            id: 'table-load',
            toolbar: '#toolbarDemo',
            cols:[
                [
                    {title:'序号',templet: '#indexTpl',width:60,align:'center'},
                    {field:'name',title:'药品名称',align:'center'},
                    {field:'number',title:'药品编码',align:'center'},
                    {field:'warrenty',title: '保质期（月）',align:'center'},
                    {field:'producttime',title:'生产时间',align:'center',
                     templet: "<div>{{layui.util.toDateString(d.producttime,'yyyy-MM-dd')}}</div>"},
                    {field:'createtime',title:'当前时间',align:'center',
                        templet: "<div>{{layui.util.toDateString(d.createtime,'yyyy-MM-dd')}}</div>"},
                    {title:'是否过期',align:'center',templet: isWarranty}
                ]
            ]
        })

        //监听头工具栏事件
        table.on('toolbar(main-table)',function (obj) {
            switch (obj.event) {

                case 'querySearch':
                    var param = $('#param').val();
                    table.reload('table-load',{
                        where: {
                            param:param
                        }
                    });
                    $('#param').val(param);
                    break;
            }
        })

        //计算药品是否过期
        function  isWarranty(d) {
           //生产日期
            var p_time  = d.producttime;
            p_time = p_time.split('-');
            var p_time_day = parseInt(p_time[0])*12+parseInt(p_time[1])*30+parseInt(p_time[2]);
            p_time = parseInt(p_time[0])*12+parseInt(p_time[1]);

            //获取当前时间
            var date = new Date();
            var year = date.getFullYear();
            var month = date.getMonth() +1 ;
            var day = date.getDate();
            console.log("当前天数---"+day);
            var now_year_month = year*12+month;
            console.log("当前月---"+now_year_month);
            var now_day = now_year_month*30+day;
            console.log("当前总天数+++"+now_day);
            var m = now_year_month - (p_time + parseInt(d.warrenty));
            console.log("月对应的时间"+p_time + parseInt(d.warrenty));
            // var expirationDays = day - (p_time_day+parseInt(d.warrenty)*30)
            console.log("保质期"+parseInt(d.warrenty)*30);
            console.log("时间"+p_time_day+parseInt(d.warrenty)*30);
            var expirationDays = now_day - (p_time_day+parseInt(d.warrenty)*30)
            if(m>1){
                 return "<span style='color:red'>已过期了"+m+"个月</span>"
            }else if(m==0){
                // if(expirationDays>0){
                //     return "<span style='color:red'>已过期了"+expirationDays+"天</span>"
                // }else {
                //     return "<span style='color: green;'>未过期,剩余"+Math.abs(expirationDays)+"天</span>"
                // }
                return "<span style='color: blue'>保质期不满一个月</span>"
            }else{
                return "<span style='color: green;'>未过期,剩余"+Math.abs(m)+"个月</span>"
            }
        }
    });
</script>
</body>
</html>